	$navTabHeight: 66px;
	@keyframes loadingRotate {
		0% {
			transform: rotate(0);
		}

		100% {
			transform: rotate(360deg);
		}
	}

	.animate-rotate {
		animation: loadingRotate 1s linear infinite;
	}
.net-home {
		width: 100%;
		height: 100%;
	}

.home-content {
	width: 100%;
	height: 100%;
	padding: 24rpx 24rpx 0;
	@include themeify {
		background-color: themed('bgColorGrey');
	}
}

.home-content {
	width: 100%;
	height: calc(100% - 58px)
}
.my-device{
	padding: 0 0 24rpx;
}

.custom-bar {
	width: 100%;
	// height: 58px;
	position: fixed;
	bottom: 0;
	left: 0;
}
.notify-comp{
	padding: 24rpx 0 0;
}
.tab-nav {
		width: 100%;
	}
.nav-item {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	justify-content: space-between;
	height: $navTabHeight;
}

.nav-box {
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	height: 100%;
}
	
.nav-item-txt {
	font-size: 16px;
	color: #8c8c8c;
	display: flex;
	flex-flow: row nowrap;
	align-items: center;
	position: relative;
	height: 100%;

	&:not(:nth-child(1)) {
		margin-left: 30rpx;
	}
}
	
	.border-bot-line {
		width: 100%;
		height: 3px;
		background-color: #2B7AFB;
		position: absolute;
		bottom: 12px;
		left: 0;
		display: none;
	}

.nav-item-icon {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-left: 30rpx;

	.iconfont {
		font-size: 44rpx;
	}

}
	
	.nav-item-tool {
		display: flex;
		flex-flow: row nowrap;
		align-items: center;
		height: 100%;
		padding: 0 8px;
	
		.iconfont {
			font-size: 28px;
		}
	
		.tool-icon {
			display: flex;
			justify-content: center;
			align-items: center;
	
			&:not(:nth-child(1)) {
				margin-left: 4px;
			}
		}
	
		.tool-icon-qm {
			width: 32px;
			height: 32px;
			border-radius: 100%;
			box-shadow: 0 0 1px rgba(43, 122, 251, 1), inset 0 0 20px rgba(43, 122, 251, 0.05);
	
			.icon-qm {
				font-size: 18px;
				color: #2B7AFB;
			}
		}
	
		.tool-icon-plus {
			.icon-plus-circle-fill {
				font-size: 40px;
				color: #2B7AFB;
			}
		}
	}
	
	// nav content
	.nav-main {
		position: relative;
		height: calc(100% - 66px);
		 -webkit-overflow-scrolling: touch; /* 启用iOS弹性滚动 */
	}
	.swiper-slide-item{
		&:not(:nth-child(1)){
			margin-top: 24rpx;
		}
	}
	.slide-p-right {
		width: 100px;
		height: 100%;
		flex-flow: row nowrap;
		@include flexCenter;
	}
	.set-box{
		flex-flow: row nowrap;
		@include flexCenter;
	}
	
	.icon-set {
		font-size: 34rpx;
	}
	
	.icon-set-text {
		margin-left: 12rpx;
	}
	.refresh-box {
		width: 100%;
		height: 140rpx;
		display: flex;
		flex-flow: row;
		justify-content: center;
		align-items: center;
		color: #c3c3c3;
	}
	.nav-item-active {
		color: #000;
		position: relative;
		font-weight: bold;
		.border-bot-line {
			display: block;
		}
	}
	.pay-body{
		background-color: rgba(241,247,255,1);
		padding: 12rpx;
	}
	.pay-item{
		@include flex-box(space-between,center,null,row,nowrap);
		font-size: 13px;
		background-color: #fff;
		padding:24rpx 12rpx;
		color: #000;
		&:not(:nth-child(1)){
			border-top: 1rpx solid #eee;
		}
	}
	.card-name{
		color: #000;
	}
	.time-out{
		color: #dd524d;
	}
	.device-loading{
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height:100%;
		@include flex-box(center,center);
		background-color: #fff;
		// background-color: rgba(238,238,238,1);
		color: #c2c2c2;
		z-index: 9999;
	}
	.device-name{
		font-weight: bold;
		color: #101010;
	}
	.device-code{
		font-size: 14px;
		margin-top: 12rpx;
	}
	.device-master{
		display: flex;
		flex-flow: row wrap;
		padding: 24rpx;
		background-image: linear-gradient(180deg, rgba(240,243,247,1) 0%,rgba(202,217,236,1) 100%);
		transform: translateY(-6px);
		border-bottom-left-radius: 20rpx;
		border-bottom-right-radius: 20rpx;
	}
	.device-msg{
		width: 50%;
		font-size: 14px;
		padding: 12rpx 0 0;
		color: #101010;
		font-weight: bold;
	}